(function () {
    let template = function (self) {
        return self.innerHTML;
    };

    function setSelected(self, newval) {
        self.$activeIndex = newval;
        if (self.children && self.children[newval]) {
            self.children[newval].auiAddOnceClass("active")
        }
        if (self.$lastActiveIndex > -1 && self.children[self.$lastActiveIndex]) {
            self.children[self.$lastActiveIndex].auiRemoveOnceClass("active");
        }
        self.$lastActiveIndex = newval;
    }

    document.auiDefineElement("aux-sel", {
        template,
        props: {
            selected: {
                observerProp(self) {
                    return  {
                        get() {
                            return self.$activeIndex;
                        },
                        set(newval) {
                            setSelected(self, newval);
                        }
                    }
                },
                afterCreated(self, newval) {
                    self.$lastActiveIndex = -1;
                    setSelected(self, newval);
                }
            }
        },
        created(self) {     
        },
        attached(self) {
        }

    });

    
})();


